<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">

<ui:composition template="/WEB-INF/templates/BasicTemplate.xhtml">

	<ui:define name="content">

		<p:panelGrid id="pnlMain" columns="4" style="margin:auto;">

			<h:panelGroup id="pnlDual" layout="block">

				<p:panelGrid id="pnlSession" rendered="#{sessionBean.agent==null}">
					<h:form id="frmLogin">
						<p:messages id="msgLogin"></p:messages>
						<h:panelGrid columns="2" style="margin:auto;text-align: center">

							<h:panelGrid columns="2" style="margin:auto;">
								<p:outputLabel value="Usuario" id="lblUsername" for="inUsername"></p:outputLabel>
								<p:inputText id="inUsername" required="true"
									requiredMessage="Debe ingresar Username"
									value="#{cCenterController.username}">
								</p:inputText>

								<p:outputLabel value="Clave" id="lblPassword" for="inPassword"></p:outputLabel>
								<p:password id="inPassword" required="true"
									requiredMessage="Debe ingresar Password"
									value="#{cCenterController.password}">
								</p:password>

							</h:panelGrid>
							<p:commandButton id="btnLogin" styleClass="button_login" value=""
								onerror="doError();"
								update=":pnlDual :formStateDetail:pnlStateDetail"
								action="#{cCenterController.doLogin}"></p:commandButton>

						</h:panelGrid>
					</h:form>
				</p:panelGrid>

				<p:panelGrid id="pnlState" rendered="#{sessionBean.agent!=null}"
					columns="1" style="height:150px;width:300px;">

					<h:panelGrid>
						<h:form id="formState" prependId="false">
							<p:messages id="state_messages"></p:messages>

							<h:panelGroup id="panel_state" layout="block">


								<h:panelGrid
									rendered="#{sessionBean.currentState=='ready' or sessionBean.currentState=='pause' or sessionBean.currentState=='break'}">
									<p:selectOneMenu id="sessionTypes"
										value="#{sessionBean.sessionTypeSelected}">
										<f:selectItems value="#{sessionBean.sessionTypes}" />
										<p:ajax listener="#{cCenterController.changeState}"
											update=":pnlDual :formStateDetail:pnlStateDetail :selectTransfers"></p:ajax>
									</p:selectOneMenu>
								</h:panelGrid>

								<h:panelGrid
									rendered="#{sessionBean.currentState=='breakwithcall' or sessionBean.currentState=='pausewithcall' or sessionBean.currentState=='logoutwithcall' or sessionBean.currentState=='pausewithwindow'}">
									<p:outputLabel
										value="Su estado cambiará al finalizar la llamada en curso." />
								</h:panelGrid>


							</h:panelGroup>
							<h:panelGrid columns="3">
								<p:outputLabel value="#{sessionBean.agent.code}"></p:outputLabel>

								<p:commandLink value="Más detalle..."
									onclick="PF('dlgStateDetail').show(); return false;" />

							</h:panelGrid>
						</h:form>



					</h:panelGrid>


				</p:panelGrid>


			</h:panelGroup>




		</p:panelGrid>

		<p:dialog header="Detalle de estados" widgetVar="dlgStateDetail">

			<h:form id="formStateDetail">

				<p:commandButton value="Actualizar" process="@form"
					onerror="doError();" update=":formStateDetail:pnlStateDetail">
				</p:commandButton>

				<h:panelGrid id="pnlStateDetail">

					<p:dataTable var="as" value="#{sessionBean.agent.sessions}">
						<f:facet name="header">Sesión Actual</f:facet>
						<p:column headerText="Campaña">
							<h:outputText value="#{as.campaign.name}"></h:outputText>
						</p:column>
						<p:column headerText="Tipo">
							<h:outputText value="#{as.sessionType.name}"></h:outputText>
						</p:column>
						<p:column headerText="Inicio">
							<h:outputText value="#{as.startedAt}">

								<f:convertDateTime pattern="dd-MM-yyyy HH:mm:ss"
									timeZone="America/Lima" />

							</h:outputText>
						</p:column>

						<p:column headerText="Duración">
							<h:outputText value="#{as.endedAtTempury}">

							</h:outputText>

						</p:column>
					</p:dataTable>



				</h:panelGrid>
			</h:form>

		</p:dialog>


		<p:growl sticky="true" id="growl_messages" widgetVar="widgetGrowl"
			globalOnly="true"></p:growl>

	</ui:define>

</ui:composition>
</html>